<template>
  <div class="app-container">
    <el-form class="el-form-register" :inline="true" label-width="230px" :model="params">
      <!-- 项目基本情况表 -->
      <div class="el-form-ls">
        <h3 @click="toggleShow('baseInfo')"><span></span>项目基本情况表</h3>
        <div class="baseinfo" v-show="showBaseInfo">
          <el-form-item class="el-form-whole" label="项目名称" prop="projectName">
            <el-input v-model="params.projectName" placeholder="请输入" disabled></el-input>
          </el-form-item>
          <el-form-item class="el-form-whole" label="项目概况" prop="survey">
            <el-input v-model="params.survey" placeholder="请输入,500字以内" :rows="3" type="textarea" maxlength="500"
              show-word-limit resize="none" disabled />
          </el-form-item>
          <el-form-item class="el-form-whole" label="项目位置(中心位置)" prop="longitude">
            <el-form-item class="el-form-sub" label-width="90" label="经度" prop="longitude">
              <el-input v-model="params.longitude" placeholder="请输入" disabled></el-input>
            </el-form-item>
            <el-form-item class="el-form-sub" label-width="90" label="纬度" prop="latitude">
              <el-input v-model="params.latitude" placeholder="请输入" disabled></el-input>
            </el-form-item>
            <!--zyt修改start-->
            <div style="position: absolute;width: 100%;height: 1px;top: 39px;left: 0px;background: lightgrey;"></div>
            <el-form-item class="el-form-sub" label-width="90" label="文件名称" prop="latitude">
              <el-input v-model="params.cpFile" placeholder="上传文件名称" style="width: 700px;" disabled></el-input>
            </el-form-item>
            <div style="position: absolute;width: 100%;height: 1px;top: 79px;left: 0px;background: lightgrey;"></div>
            <div style="height:200px;">
              <!--地图-->
              <ResultMap v-if="params.geomText != ''" :geomText="params.geomText"></ResultMap>
            </div>
            <!--zyt修改end-->
          </el-form-item>
          <el-form-item class="el-form-half" label="所在行政区（乡镇级别）：" prop="administrativeRegion">
            <el-cascader :props="xzqProps" placeholder="请选择" v-model="params.administrativeRegion" @change="xzqChange"
              disabled />
          </el-form-item>
          <el-form-item class="el-form-half" style="border-left: none" label="提交报告日期(到月)" prop="subDate">
            <el-date-picker v-model="params.subDate" type="month" placeholder="请选择" disabled />
          </el-form-item>
          <el-form-item class="el-form-whole" label="评审单位" prop="reviewUnit">
            <el-input v-model="params.reviewUnit" placeholder="请输入" disabled></el-input>
          </el-form-item>
          <el-form-item class="el-form-whole" label="承担单位" prop="undertaker">
            <el-input v-model="params.undertaker" placeholder="请输入" disabled></el-input>
          </el-form-item>
          <el-form-item class="el-form-whole" label="委托单位" prop="client">
            <el-input v-model="params.client" placeholder="请输入" disabled></el-input>
          </el-form-item>
          <el-form-item class="el-form-whole" label="工程类别" prop="projectType">
            <el-select v-model="params.projectType" placeholder="请选择" class="form-select" disabled>
              <el-option v-for="item in projectTypeOptions" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
            <div class="project-type-remarks">
              <span>{{ params.projectTypeRemarks }}</span>
            </div>
          </el-form-item>
          <el-form-item label="安评等级：" class="form-item el-form-half" prop="safetyRating">
            <el-select v-model="params.safetyRating" placeholder="请选择" class="form-select" disabled>
              <el-option v-for="item in safetyRatingOptions" :key="item.value" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item class="el-form-half" style="border-left: none" label="钻孔数量" prop="controlPoints">
            <el-input v-model="params.controlPoints" placeholder="请输入" disabled></el-input>
          </el-form-item>
          <!-- <el-form-item class="el-form-whole" label="" prop="evaluationResults">
            <template #label style="line-height: 32px !important">
              评价结论<br />
              (设防水平相当于区划图)
            </template>
            <el-input v-model="params.evaluationResults" placeholder="请输入,800字以内" :rows="5" type="textarea"
              maxlength="800" show-word-limit resize="none" disabled />
          </el-form-item>
          <el-form-item class="el-form-whole" label="与区划图比较" prop="compare">
            <el-input v-model="params.compare" placeholder="请输入,800字以内" :rows="5" type="textarea"
              maxlength="800" show-word-limit resize="none" disabled />
          </el-form-item> -->
          <el-form-item class="el-form-whole" label="登记人">
            <span>{{ params.registrant }}</span>
          </el-form-item>
          <el-form-item class="el-form-half" label="录入时间">
            {{ params.createTime }}
          </el-form-item>
          <el-form-item class="el-form-half" label="登记单位">
            {{ params.registrationUnit }}
          </el-form-item>
        </div>
      </div>
      <!-- 关键性图件 -->
      <div class="el-form-ls">
        <h3 @click="toggleShow('keyMap')"><span></span>关键性图件</h3>
        <div class="img-containers" v-show="showKeyMap">
          <el-form-item class="el-form-whole" label="（一）区域地震构造图">
            <ImageLook v-if="params.fileMap && params.fileMap.rsMap" :isdisabled="true" :attachId="params.fileMap.rsMap.attachId" />
          </el-form-item>

          <el-form-item class="el-form-whole" label="（二）本次新增加的断层剖面图">
            <ImageLook v-if="params.fileMap && params.fileMap.fpMap" :isdisabled="true" :attachId="params.fileMap.fpMap.attachId" />
          </el-form-item>

          <el-form-item class="el-form-whole" label="（三）近场地震构造图">
            <ImageLook v-if="params.fileMap && params.fileMap.nfSsMap" :isdisabled="true" :attachId="params.fileMap.nfSsMap.attachId" />
          </el-form-item>

          <el-form-item class="el-form-whole" label="（四）区域地震震中分布图">
            <ImageLook v-if="params.fileMap && params.fileMap.reedMap" :isdisabled="true" :attachId="params.fileMap.reedMap.attachId" />
          </el-form-item>

          <el-form-item class="el-form-whole" label="（五）近场地震震中分布图">
            <ImageLook v-if="params.fileMap && params.fileMap.nfeedMap" :isdisabled="true" :attachId="params.fileMap.nfeedMap.attachId" />
          </el-form-item>

          <el-form-item class="el-form-whole" label="（六）潜在震源区图">
            <ImageLook v-if="params.fileMap && params.fileMap.psaMap" :isdisabled="true" :attachId="params.fileMap.psaMap.attachId" />
          </el-form-item>

          <el-form-item class="el-form-whole" label="（七）钻孔柱状图">
            <ImageLook v-if="params.fileMap && params.fileMap.bhMap" :isdisabled="true" :attachId="params.fileMap.bhMap.attachId" />
          </el-form-item>

          <el-form-item class="el-form-whole" label="（八）地震动参数分区">
            <ImageLook v-if="params.fileMap && params.fileMap.seismicPz" :isdisabled="true" :attachId="params.fileMap.seismicPz.attachId" />
          </el-form-item>

          <el-form-item class="el-form-whole" label="（九）钻孔分布图">
            <ImageLook v-if="params.fileMap && params.fileMap.bdMap" :isdisabled="true" :attachId="params.fileMap.bdMap.attachId" />
          </el-form-item>

          <el-form-item class="el-form-whole" label="（十）工程地质剖面图">
            <ImageLook v-if="params.fileMap && params.fileMap.egProfile" :isdisabled="true" :attachId="params.fileMap.egProfile.attachId" />
          </el-form-item>
        </div>
      </div>

      <!-- 关键性数据表格 -->
      <div class="el-form-ls">
        <h3 @click="toggleShow('keyTable')"><span></span>关键性数据表格</h3>
        <div v-show="showKeyTable">
          <div class="historicalEarthquakeCatalogue">
            <h4>（一）历史地震目录</h4>
            <el-table class="listTable" ref="multipleTableRef" border :data="params.historyEarthquakeCatalogueTableData"
              style="width: 100%" :cell-style="{ border: '1px solid #e5ebf7' }"
              :header-cell-style="{ border: '1px solid #e5ebf7', borderLeft: 'none' }">
              <el-table-column type="index" width="55" label="编号" />
              <el-table-column header-align="center" align="center">
                <template #header>
                  <span class="column-header-sign">*</span>
                  <span class="column-header-label">发震时间</span>
                </template>
                <el-table-column prop="eoTimeYmd" header-align="center" align="center">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">年月日</span>
                  </template>
                  <template #default="scope">
                    <el-form-item prop="eoTimeYmd">
                      <!-- <el-date-picker v-model="scope.row.eoTimeYmd" type="date" placeholder="" disabled /> -->
                      <el-input v-model="scope.row.eoTimeYmd" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="eoTimeHms" header-align="center" align="center">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">时分秒</span>
                  </template>
                  <template #default="scope">
                    <el-form-item prop="eoTimeHms">
                      <el-time-picker v-model="scope.row.eoTimeHms" size="small" placeholder="" format="HH:mm:ss" value-format="hh:mm:ss" disabled />
                    </el-form-item>
                  </template>
                </el-table-column>
              </el-table-column>

              <el-table-column label="震中位置" header-align="center" align="center">
                <template #header>
                  <span class="column-header-sign">*</span>
                  <span class="column-header-label">震中位置</span>
                </template>
                <el-table-column label="北纬" prop="northLatitude" header-align="center" align="center" width="110">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">北纬</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'historyEarthquakeCatalogueTableData.' +
                      scope.$index +
                      '.northLatitude'
                      ">
                      <el-input v-model="scope.row.northLatitude" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column label="东经" prop="eastLongitude" header-align="center" align="center" width="110">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">东经</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'historyEarthquakeCatalogueTableData.' +
                      scope.$index +
                      '.eastLongitude'">
                      <el-input v-model="scope.row.eastLongitude" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
              </el-table-column>

              <el-table-column prop="magnitude" header-align="center" align="center" label="震级">
                <template #header>
                  <span class="column-header-sign">*</span>
                  <span class="column-header-label">震级</span>
                </template>
                <template #default="scope">
                  <el-form-item :prop="'historyEarthquakeCatalogueTableData.' +
                    scope.$index +
                    '.magnitude'
                    ">
                    <el-input v-model="scope.row.magnitude" size="small" disabled></el-input>
                  </el-form-item>
                </template>
              </el-table-column>

              <el-table-column prop="depth" header-align="center" align="center" label="深度">
                <template #header>
                  <span class="column-header-sign">*</span>
                  <span class="column-header-label">深度</span>
                </template>
                <template #default="scope">
                  <el-form-item :prop="'historyEarthquakeCatalogueTableData.' +
                    scope.$index +
                    '.depth'
                    ">
                    <el-input v-model="scope.row.depth" size="small" disabled></el-input>
                  </el-form-item>
                </template>
              </el-table-column>

              <el-table-column prop="epicentralIntensity" header-align="center" align="center" label="震中烈度">
                <!-- <template #header>
                  <span class="column-header-sign">*</span>
                  <span class="column-header-label">震中烈度</span> 
                </template> -->
                <template #default="scope">
                  <el-form-item :prop="'historyEarthquakeCatalogueTableData.' +
                    scope.$index +
                    '.epicentralIntensity'
                    ">
                    <el-input v-model="scope.row.epicentralIntensity" size="small" disabled></el-input>
                  </el-form-item>
                </template>
              </el-table-column>

              <el-table-column prop="accuracy" header-align="center" align="center" label="精度">
                <template #header>
                  <span class="column-header-sign">*</span>
                  <span class="column-header-label">精度</span>
                </template>
                <template #default="scope">
                  <el-form-item :prop="'historyEarthquakeCatalogueTableData.' +
                    scope.$index +
                    '.accuracy'
                    ">
                    <el-input v-model="scope.row.accuracy" size="small" disabled></el-input>
                  </el-form-item>
                </template>
              </el-table-column>

              <el-table-column prop="erpName" header-align="center" align="center" label="震中参考地名">
                <template #header>
                  <span class="column-header-sign">*</span>
                  <span class="column-header-label">震中参考地名</span>
                </template>
                <template #default="scope">
                  <el-form-item :prop="'historyEarthquakeCatalogueTableData.' +
                    scope.$index +
                    '.erpName'
                    ">
                    <el-input v-model="scope.row.erpName" size="small" disabled></el-input>
                  </el-form-item>
                </template>
              </el-table-column>
            </el-table>
          </div>

          <div class="solum">
            <h4>（二）土层</h4>
            <div class="holeFormingInformation">
              <h5>成孔信息</h5>
              <el-table class="listTable" ref="multipleTableRef" border :data="params.holeTableData" style="width: 100%"
                :cell-style="{ border: '1px solid #e5ebf7', }"
                :header-cell-style="{ border: '1px solid #e5ebf7', borderLeft: 'none' }">
                <el-table-column type="index" width="55" label="序号" />
                <el-table-column prop="projectName" header-align="center" align="center" label="钻孔依托的项目">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">钻孔依托的项目</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'holeTableData.' + scope.$index + '.projectName'">
                      <el-input v-model="scope.row.projectName" size="small" disabled></el-input>
                      <!-- <el-select v-model="scope.row.projectName" size="small" placeholder="请选择" class="form-select" disabled>
                        <el-option v-for="item in projectIdOptions" :key="item.value" :label="item.label"
                          :value="item.label">
                        </el-option>
                      </el-select> -->
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="boreholeNumber" header-align="center" align="center" label="钻孔编号">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">钻孔编号</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'holeTableData.' + scope.$index + '.boreholeNumber'">
                      <el-input v-model="scope.row.boreholeNumber" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="hlLongitude" header-align="center" align="center" label="孔位经度（°）">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">孔位经度（°）</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'holeTableData.' + scope.$index + '.hlLongitude'">
                      <el-input v-model="scope.row.hlLongitude" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="hlLatitude" header-align="center" align="center" label=" 孔位纬度（°）">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">孔位纬度（°）</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'holeTableData.' + scope.$index + '.hlLatitude'">
                      <el-input v-model="scope.row.hlLatitude" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="drillingDepth" header-align="center" align="center" label="钻孔深度（m）">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">钻孔深度（m）</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'holeTableData.' + scope.$index + '.drillingDepth'">
                      <el-input v-model="scope.row.drillingDepth" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="groundElevation" header-align="center" align="center" label="地面高程（m）">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">地面高程（m)</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'holeTableData.' + scope.$index + '.groundElevation'
                      ">
                      <el-input v-model="scope.row.groundElevation" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="groundwaterLevel" header-align="center" align="center" label="地下水位（m）">
                  <template #default="scope">
                    <el-form-item :prop="'holeTableData.' + scope.$index + '.groundwaterLevel'">
                      <el-input v-model="scope.row.groundwaterLevel" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
              </el-table>
            </div>

            <div class="soilDynamicParameters">
              <h5>土动力参数</h5>
              <el-table class="listTable" ref="multipleTableRef" border :data="params.soilTableData" style="width: 100%"
                :cell-style="{ border: '1px solid #e5ebf7', }"
                :header-cell-style="{ border: '1px solid #e5ebf7', borderLeft: 'none', }">
                <el-table-column type="index" width="55" label="序号" />
                <el-table-column prop="stNumber" header-align="center" align="center" label="土类号">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">土类号</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'soilTableData.' + scope.$index + '.stNumber'">
                      <el-input v-model="scope.row.stNumber" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="geotechnicalName" header-align="center" align="center" label="岩土名称">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">岩土名称</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'soilTableData.' + scope.$index + '.geotechnicalName'">
                      <el-input v-model="scope.row.geotechnicalName" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="boreholeNumber" header-align="center" align="center" label="钻孔编号">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">钻孔编号</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'soilTableData.' + scope.$index + '.boreholeNumber'">
                      <el-input v-model="scope.row.boreholeNumber" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="bdosSample" header-align="center" align="center" label="土样埋深">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">土样埋深</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'soilTableData.' + scope.$index + '.bdosSample'">
                      <el-input v-model="scope.row.bdosSample" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="parameterSource" header-align="center" align="center" label="参数来源">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">参数来源</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'soilTableData.' + scope.$index + '.parameterSource'">
                      <el-input v-model="scope.row.parameterSource" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="sdDensity" header-align="center" align="center" label="密度(kg/m3)">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">密度(kg/m3)</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'soilTableData.' + scope.$index + '.sdDensity'">
                      <el-input v-model="scope.row.sdDensity" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column label="模量比(G/Gmax)剪应变(γ)（10^-4×0.05)" prop="modulusRatio1">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">模量比(G/Gmax)剪应变(γ)（10^-4×0.05)</span>
                  </template>
                </el-table-column>

                <el-table-column label="模量比(G/Gmax)剪应变(γ)（10^-4×0.10)" prop="modulusRatio2">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">模量比(G/Gmax)剪应变(γ)（10^-4×0.10)</span>
                  </template>
                </el-table-column>

                <el-table-column label="模量比(G/Gmax)剪应变(γ)（10^-4×0.50)" prop="modulusRatio3">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">模量比(G/Gmax)剪应变(γ)（10^-4×0.50)</span>
                  </template>
                </el-table-column>

                <el-table-column label="模量比(G/Gmax)剪应变(γ)（10-4×1.00)" prop="modulusRatio4">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">模量比(G/Gmax)剪应变(γ)（10-4×1.00)</span>
                  </template>
                </el-table-column>

                <el-table-column label="模量比(G/Gmax)剪应变(γ)（10^-4×5.00)" prop="modulusRatio5">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">模量比(G/Gmax)剪应变(γ)（10^-4×5.00)</span>
                  </template>
                </el-table-column>

                <el-table-column label="模量比(G/Gmax)剪应变(γ)（10^-4×10.00)" prop="modulusRatio6">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">模量比(G/Gmax)剪应变(γ)（10^-4×10.00)</span>
                  </template>
                </el-table-column>

                <el-table-column label="模量比(G/Gmax)剪应变(γ)（10^-4×50.00)" prop="modulusRatio7">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">模量比(G/Gmax)剪应变(γ)（10^-4×50.00)</span>
                  </template>
                </el-table-column>

                <el-table-column label="模量比(G/Gmax)剪应变(γ)（10^-4×100.00)" prop="modulusRatio8">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">模量比(G/Gmax)剪应变(γ)（10^-4×100.00)</span>
                  </template>
                </el-table-column>

                <el-table-column label="阻尼比(λ)剪应变(γ)（10^-4×0.05)" prop="dampingRatio1">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">模量比(G/Gmax)剪应变(γ)（10^-4×0.05)</span>
                  </template>
                </el-table-column>

                <el-table-column label="阻尼比(λ)剪应变(γ)（10^-4×0.10)" prop="dampingRatio2">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">阻尼比(λ)剪应变(γ)（10^-4×0.10)</span>
                  </template>
                </el-table-column>

                <el-table-column label="阻尼比(λ)剪应变(γ)（10^-4×0.50)" prop="dampingRatio3">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">阻尼比(λ)剪应变(γ)（10^-4×0.50)</span>
                  </template>
                </el-table-column>

                <el-table-column label="阻尼比(λ)剪应变(γ)（10^-4×1.00)" prop="dampingRatio4">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">阻尼比(λ)剪应变(γ)（10^-4×1.00)</span>
                  </template>
                </el-table-column>

                <el-table-column label="阻尼比(λ)剪应变(γ)（10^-4×5.00)" prop="dampingRatio5">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">阻尼比(λ)剪应变(γ)（10^-4×5.00)</span>
                  </template>
                </el-table-column>

                <el-table-column label="阻尼比(λ)剪应变(γ)（10^-4×10.00)" prop="dampingRatio6">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">阻尼比(λ)剪应变(γ)（10^-4×10.00)</span>
                  </template>
                </el-table-column>

                <el-table-column label="阻尼比(λ)剪应变(γ)（10^-4×50.00)" prop="dampingRatio7">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">阻尼比(λ)剪应变(γ)（10^-4×50.00)</span>
                  </template>
                </el-table-column>

                <el-table-column label="阻尼比(λ)剪应变(γ)（10^-4×100.00)" prop="dampingRatio8">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">阻尼比(λ)剪应变(γ)（10^-4×100.00)</span>
                  </template>
                </el-table-column>
              </el-table>
            </div>

            <div class="drillingCalculationModel">
              <h5>钻孔计算模型</h5>
              <el-table class="listTable" ref="multipleTableRef" border :data="params.drillingTableData"
                style="width: 100%" :cell-style="{ border: '1px solid #e5ebf7' }"
                :header-cell-style="{ border: '1px solid #e5ebf7', borderLeft: 'none', }">
                <el-table-column type="index" width="55" label="序号" />
                <el-table-column prop="geotechnicalName" header-align="center" align="center" label="岩土名称">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">岩土名称</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'drillingTableData.' + scope.$index + '.geotechnicalName'">
                      <el-input v-model="scope.row.geotechnicalName" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="stNumber" header-align="center" align="center" label="土类号">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">土类号</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'drillingTableData.' + scope.$index + '.stNumber'">
                      <el-input v-model="scope.row.stNumber" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="lbDepth" header-align="center" align="center" label="层底深度(m)">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">层底深度(m)</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'drillingTableData.' + scope.$index + '.lbDepth'">
                      <el-input v-model="scope.row.lbDepth" size="small" type="number" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="geotechnicalDensity" header-align="center" align="center" label="密度(kg/m^3)">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">密度(kg/m3)</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'drillingTableData.' + scope.$index + '.geotechnicalDensity'">
                      <el-input v-model="scope.row.geotechnicalDensity" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="layerThickness" header-align="center" align="center" label="层厚(m)">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">层厚(m)</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'drillingTableData.' + scope.$index + '.layerThickness'">
                      <el-input v-model="scope.row.layerThickness" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="swVelocity" header-align="center" align="center" label="剪切波波速V(m/s)">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">剪切波波速V(m/s)</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'drillingTableData.' + scope.$index + '.swVelocity'">
                      <el-input v-model="scope.row.swVelocity" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
          <div class="historicalEarthquakeCatalogue">
            <h4>（三）地震地质灾害评价</h4>
            <el-form-item class="el-form-whole" label="">
              <el-input v-model="params.saghEvaluation" placeholder="Please input" :rows="5" type="textarea"
                maxlength="500" show-word-limit resize="none" disabled />
            </el-form-item>
          </div>
          <div class="siteConditionEvaluation">
            <h4>（四）场地类别</h4>
            <div class="holeFormingInformation">
              <h5>场地类别判别信息表</h5>
              <el-table class="listTable" ref="multipleTableRef" border :data="infoTableData" style="width: 100%"
                :cell-style="{ border: '1px solid #e5ebf7', }"
                :header-cell-style="{ border: '1px solid #e5ebf7', borderLeft: 'none' }">
                <el-table-column type="index" width="55" label="序号" />
                <el-table-column prop="boreholeNumber" header-align="center" align="center" label="钻孔编号（与土层模型相对应）">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">钻孔编号（与土层模型相对应）</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'infoTableData.' + scope.$index + '.boreholeNumber'">
                      <el-input v-model="scope.row.boreholeNumber" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="eswv" header-align="center" align="center" label="20m等效剪切波速（M/s）">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">20m等效剪切波速（M/s）</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'infoTableData.' + scope.$index + '.eswv'">
                      <el-input v-model="scope.row.eswv" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="tocLayer" header-align="center" align="center" label="覆盖层厚度m">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">覆盖层厚度m</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'infoTableData.' + scope.$index + '.tocLayer'">
                      <el-input v-model="scope.row.tocLayer" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="fieldType" header-align="center" align="center" label="场地类别">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">场地类别</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'infoTableData.' + scope.$index + '.fieldType'">
                      <el-input v-model="scope.row.fieldType" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
          <div class="newExplorationLine">
            <h4>（五）新开展的勘探测线</h4>
            <div class="lineInformationTable">
              <h5>测线信息表格</h5>
              <el-table class="listTable" ref="multipleTableRef" border :data="lineInfoTableData" style="width: 100%"
                :cell-style="{ border: '1px solid #e5ebf7' }"
                :header-cell-style="{ border: '1px solid #e5ebf7', borderLeft: 'none' }">
                <el-table-column type="index" width="55" label="序号" />
                <el-table-column prop="testNumber" header-align="center" align="center" label="测线编号">
                  <template #default="scope">
                    <el-form-item :prop="'lineInfoTableData.' + scope.$index + '.testNumber'
                      ">
                      <el-input v-model="scope.row.testNumber" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="testAr" header-align="center" align="center" label="测线所在行政区（乡镇级别）" min-width="200">
                  <template #default="scope">
                    <el-form-item :prop="'lineInfoTableData.' + scope.$index + '.testAr'">
                      <el-cascader :props="xzqProps" placeholder="请选择" v-model="scope.row.testAr" @change="xzqChange1"
                        disabled />
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="constructionUnit" header-align="center" align="center" label="施工单位">
                  <template #default="scope">
                    <el-form-item :prop="'lineInfoTableData.' +
                      scope.$index +
                      '.constructionUnit'
                      ">
                      <el-input v-model="scope.row.constructionUnit" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column label="起点（小数点后6位）" header-align="center" align="center">
                  <el-table-column prop="startLongitude" label="经度" header-align="center" align="center" width="110">
                    <template #default="scope">
                      <el-form-item :prop="'lineInfoTableData.' +
                        scope.$index +
                        '.startLongitude'
                        ">
                        <el-input v-model="scope.row.startLongitude" size="small" disabled></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>

                  <el-table-column prop="startLatitude" label="纬度" header-align="center" align="center" width="110">
                    <template #default="scope">
                      <el-form-item :prop="'lineInfoTableData.' + scope.$index + '.startLatitude'
                        ">
                        <el-input v-model="scope.row.startLatitude" size="small" disabled></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                </el-table-column>

                <el-table-column label="终点（小数点后6位）" header-align="center" align="center">
                  <el-table-column prop="endLongitude" label="经度" header-align="center" align="center" width="110">
                    <template #default="scope">
                      <el-form-item :prop="'lineInfoTableData.' + scope.$index + '.endLongitude'
                        ">
                        <el-input v-model="scope.row.endLongitude" size="small" disabled></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>

                  <el-table-column prop="endLatitude" label="纬度" header-align="center" align="center" width="110">
                    <template #default="scope">
                      <el-form-item :prop="'lineInfoTableData.' + scope.$index + '.endLatitude'
                        ">
                        <el-input v-model="scope.row.endLatitude" size="small" disabled></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                </el-table-column>

                <el-table-column prop="surveyMethod" header-align="center" align="center" label="勘探方式">
                  <template #default="scope">
                    <el-form-item :prop="'lineInfoTableData.' + scope.$index + '.surveyMethod'
                      ">
                      <el-input v-model="scope.row.surveyMethod" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>

                <el-table-column prop="testLength" header-align="center" align="center" label="长度km">
                  <template #default="scope">
                    <el-form-item :prop="'lineInfoTableData.' + scope.$index + '.testLength'
                      ">
                      <el-input v-model="scope.row.testLength" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="pposlMap" label="地震反射时间剖面和地质解释剖面" header-align="center" align="center" width="120">
                  <template #default="scope">
                    <el-form-item>
                      <span v-if="!scope.row.pposlMap">无</span>
                      <ImagePreview :src="`/attachment/downLoadFile?attachId=${scope.row.pposlMap}`" :width="100" :height="100" v-else></ImagePreview>
                    </el-form-item>
                  </template>
                </el-table-column>
              </el-table>
              <!-- <div class="img-containers">
                <el-form-item class="el-form-whole" label="测线剖面图片">
                  <ImageLook v-if="params.fileMap && params.fileMap.lpPicture"
                    :attachId="params.fileMap.lpPicture.attachId" />
                </el-form-item>
              </div> -->
            </div>
          </div>

          <div class="newDevelopGeologicalProfiles">
            <h4>（六）新开展的地质剖面</h4>
            <div class="geologicalInformationTable">
              <h5>地质剖面信息表格</h5>
              <el-table class="listTable" ref="multipleTableRef" border :data="params.geologicalInfoTableData"
                style="width: 100%" :cell-style="{ border: '1px solid #e5ebf7' }"
                :header-cell-style="{ border: '1px solid #e5ebf7', borderLeft: 'none' }">
                <el-table-column type="index" width="75" label="序号">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">序号</span>
                  </template>
                </el-table-column>
                <el-table-column prop="bisectName" header-align="center" align="center" label="剖面名称">
                  <template #default="scope">
                    <el-form-item :prop="'geologicalInfoTableData.' + scope.$index + '.bisectName'
                      ">
                      <el-input v-model="scope.row.bisectName" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="sectionArea" header-align="center" align="center" label="剖面所在行政区（乡镇级别）"
                  min-width="200">
                  <template #default="scope">
                    <el-form-item :prop="'geologicalInfoTableData.' + scope.$index + '.sectionArea'">
                      <el-cascader :props="xzqProps" placeholder="请选择" v-model="scope.row.sectionArea"
                        @change="xzqChange2" ref="checkedAreaRef" disabled />
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="longitude" label="经度" header-align="center" align="center">
                  <template #default="scope">
                    <el-form-item :prop="'geologicalInfoTableData.' +
                      scope.$index +
                      '.longitude'
                      ">
                      <el-input v-model="scope.row.longitude" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="latitude" label="纬度" header-align="center" align="center">
                  <template #default="scope">
                    <el-form-item :prop="'geologicalInfoTableData.' + scope.$index + '.latitude'
                      ">
                      <el-input v-model="scope.row.latitude" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="pposlMap" label="地质剖面图片" header-align="center" align="center" width="120">
                  <template #default="scope">
                      <span v-if="!scope.row.pposlMap">无</span>
                      <ImagePreview :src="`/attachment/downLoadFile?attachId=${scope.row.pposlMap}`" :width="100" :height="100"  v-else></ImagePreview>
                  </template>
                </el-table-column>
              </el-table>
              <!-- <div class="img-containers">
                <el-form-item class="el-form-whole" label="地质剖面图片">
                  <ImageLook v-if="params.fileMap && params.fileMap.lpPicture"
                    :attachId="params.fileMap.lpPicture.attachId" />
                </el-form-item>
              </div> -->
            </div>
          </div>

          <div class="siteGroundMotionParameters">
            <h4>（七）场地地震动参数</h4>
            <div class="parametersTable">
              <el-table class="listTable" ref="multipleTableRef" border :data="siteTableData" style="width: 100%"
                :cell-style="{ border: '1px solid #e5ebf7' }"
                :header-cell-style="{ border: '1px solid #e5ebf7', borderLeft: 'none' }">
                <el-table-column type="index" width="55" label="序号" />
                <el-table-column prop="transcendProbability" header-align="center" align="center" label="超越概率">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">超越概率</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'siteTableData.' +
                      scope.$index +
                      '.transcendProbability'
                      ">
                      <el-input v-model="scope.row.transcendProbability" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="amaxGal" header-align="center" align="center" label="Amax(gal)">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">Amax(gal)</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'siteTableData.' + scope.$index + '.amaxGal'">
                      <el-input v-model="scope.row.amaxGal" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="bm" header-align="center" align="center" label="βm">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">βm</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'siteTableData.' + scope.$index + '.bm'">
                      <el-input v-model="scope.row.bm" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="amax" label="αmax" header-align="center" align="center">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">αmax</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'siteTableData.' + scope.$index + '.amax'">
                      <el-input v-model="scope.row.amax" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="t1S" label="T1 (s)" header-align="center" align="center">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">T1 (s)</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'siteTableData.' + scope.$index + '.t1S'">
                      <el-input v-model="scope.row.t1S" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="tgS" label="Tg(s)" header-align="center" align="center">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">Tg(s)</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'siteTableData.' + scope.$index + '.tgS'">
                      <el-input v-model="scope.row.tgS" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="v" label="γ" header-align="center" align="center">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">γ</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'siteTableData.' + scope.$index + '.v'">
                      <el-input v-model="scope.row.v" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
                <el-table-column prop="dampingRatio " header-align="center" align="center" label="阻尼比">
                  <template #header>
                    <span class="column-header-sign">*</span>
                    <span class="column-header-label">阻尼比</span>
                  </template>
                  <template #default="scope">
                    <el-form-item :prop="'siteTableData.' + scope.$index + '. dampingRatio '
                      ">
                      <el-input v-model="scope.row.dampingRatio" size="small" disabled></el-input>
                    </el-form-item>
                  </template>
                </el-table-column>
              </el-table>
              <el-form-item class="el-form-whole" label="地震动峰值加速度归档（50年10%）(g)：" prop="aospFile" required>
                <el-input v-model="params.aospFile" placeholder="请输入" disabled></el-input>
              </el-form-item>
              <el-form-item class="el-form-half" label="周期点：" prop="periodicPoint">
                <el-input v-model="params.periodicPoint" placeholder="" disabled></el-input>
              </el-form-item>
              <el-form-item class="el-form-half" style="border-left: none" label="反应谱值：" prop="rsValue">
                <el-input v-model="params.rsValue" placeholder="" disabled></el-input>
              </el-form-item>
            </div>
          </div>
        </div>
      </div>
      <!-- 附件 -->
      <div class="el-form-ls">
        <h3 @click="toggleShow('accessory')"><span></span>附件</h3>
        <div class="img-containers" v-show="showAccessory">
          <el-form-item class="el-form-whole" label="上传报告" prop="projectName">
            <file-upload ref="fileUpload" :fileType="['pdf', 'doc', 'docx', 'xlsx']" :fileSize="10240"
              v-model="params.attachList" disabled :showCustomTip="true"
              :customTipContent="'注：附件格式：pdf、doc、docx、xlsx，附件最大可上传10G文件。'" />
          </el-form-item>
        </div>
      </div>
    </el-form>
  </div>
</template>
<script setup>
//地图
import ResultMap from '@/map/components/resultMap/map.vue';
import {
  safetyRatingList,
  xzqList,
  getSaResultsById,
  projectTypeList,
  queryAllProject
} from "@/api/safetyEvalutionResultsBank/safetyEvaResCatRegister.js";
import ImageLook from '../components/ImageLook.vue'
import { getCurrentInstance } from 'vue';

// 当前实例
const { proxy } = getCurrentInstance();
// 当前路由
const route = useRoute();
// 加载动画
const loading = ref(false);

// 挂载完成
onMounted(() => {
  getProjectTypeList();
  //getprojectIdList();
  const querParams = {
    projectId: route.params.projectid
  }
  // 开启动画
  proxy.$modal.loading('加载中...');
  getSaResultsById(querParams).then(res => {
    // 关闭动画
    proxy.$modal.closeLoading();
    if (res.code === 200) {
      initFormData(res.data)
    }
  }).catch(error => {
    // 关闭动画
    proxy.$modal.closeLoading();
    console.log(error)
  })
});

const initFormData = (formData) => {
  // 表单的这样写
  params.value = formData.dzqhApAsicMapEntity
  //zyt修改start
  params.value.cpFile = formData.dzqhApAsicMapEntity.cpFile || ''
  params.value.geomText = formData.dzqhApAsicMapEntity.geomText || ''
  //zyt修改end
  params.value.administrativeRegion = formData.dzqhApAsicMapEntity.administrativeRegion.split(',')
  // 地质剖面信息表格
  if (formData.profileInformationList) {
    params.value.geologicalInfoTableData = formData.profileInformationList.map(item => {
      if (typeof item.sectionArea == 'string') {
        item.sectionArea = item.sectionArea.split(',')
      }
      return item
    })
  } else {
    params.value.geologicalInfoTableData = []
  }
  params.value.drillingTableData = formData.dzqhApCruxDhEntityList
  //测线信息lineInfoTableData
  lineInfoTableData.value = formData.dzqhApCruxElEntityList.map(item => {
    if (typeof item.testAr == 'string') {
      item.testAr = item.testAr.split(',')
    }
    return item
  })
  //历史地震目录historyEarthquakeCatalogueTableData
  // params.value.historyEarthquakeCatalogueTableData = formData.dzqhApCruxHecEntityList.map(item => {
  //   item.eoTimeHms = new Date(`${item.eoTimeYmd} ${item.eoTimeHms}`)
  //   return item
  // })
  params.value.historyEarthquakeCatalogueTableData = formData.dzqhApCruxHecEntityList || []
  params.value.holeTableData = formData.dzqhApCruxLayerPfEntityList//成孔信息holeTableData
  infoTableData.value = formData.dzqhApCruxScEntityList//场地类别判别信息infoTableData
  params.value.soilTableData = formData.dzqhApCruxSdEntityList//成孔信息holeTableData
  siteTableData.value = formData.dzqhApCruxSgmEntityList//场地类别判别信息infoTableData
  params.value.fileMap = formData.fileMap;
  params.value.attachList = [formData.fileMap.uploadReport] //附件回显
}

// 上传
const upload = reactive({
  isUploading: false,
  // headers: { token: "tokrn " + getToken() },
  url: import.meta.env.VITE_APP_BASE_API + "/attachment/uploadFile",
});

const data = reactive({
  showBaseInfo: true, //是否显示项目基本情况表
  showKeyMap: true,
  showKeyTable: true,
  showAccessory: true,
  // 表单参数
  params: {
    projectName: "", //项目名称
    survey: "", //项目概况
    longitude: "", //项目经度
    latitude: "", //项目纬度
    //zyt修改start
    cpFile: "",//中心文件位置点线文件
    geomText: "",//空间数据
    //zyt修改end
    administrativeRegion: [], //所在行政区
    subDate: "", //提交日期
    reviewUnit: "", //评审单位
    undertaker: "", //承担单位
    client: "", //委托单位
    projectType: "", //工程类别
    projectTypeRemarks: "", //工程类别备注
    safetyRating: "", //安评等级
    controlPoints: "", //钻孔数量
    evaluationResults: "", //评价结论
    compare: "", //与区划图比较
    createUser: "", //登记人
    createTime: "", //录入时间
    registrationUnit: "", //登记单位
    aospFile: "", //地震动峰值加速度归档（50年10%）(g)
    periodicPoint: "", // 周期点
    rsValue: "", // 反应谱值
    saghEvaluation: "", // 地震地质灾害评价

    //   reasonModification: "", //修改原由
    //   modifyDetails: "", //修改详细信息
    //   reasonDeletion: "", //删除原由,
    drillingTableData: [],
    historyEarthquakeCatalogueTableData: []
  },
  safetyRatingOptions: [],
  projectTypeOptions: [],
  holeTableData: [],
  soilTableData: [],

  infoTableData: [],
  lineInfoTableData: [],
  siteTableData: [],
  //projectIdOptions: []
});
const {
  showBaseInfo,
  showKeyMap,
  showKeyTable,
  showAccessory,
  params,
  infoTableData,
  lineInfoTableData,
  siteTableData,
  safetyRatingOptions,
  projectTypeOptions,
  //projectIdOptions
} = toRefs(data);

// 点击展开收起
function toggleShow(value) {
  switch (value) {
    case "baseInfo":
      showBaseInfo.value = !showBaseInfo.value;
      break;
    case "keyMap":
      showKeyMap.value = !showKeyMap.value;
      break;
    case "keyTable":
      showKeyTable.value = !showKeyTable.value;
      break;
    case "accessory":
      showAccessory.value = !showAccessory.value;
      break;
    default:
      break;
  }
}

/** 安评等级列表 */
const getSafetyRatingList = () => {
  safetyRatingList()
    .then((res) => {
      //console.log(res);
      if (res.code === 200) {
        safetyRatingOptions.value = [];
        const options = res.data.sort((a, b) => a.sort - b.sort);
        options.forEach((item) => {
          safetyRatingOptions.value.push({
            value: item.dictItemCode,
            label: item.dictItemName,
          });
        });
      }
    })
    .catch((err) => {
      console.log(err);
    });
};

onMounted(() => {
  getSafetyRatingList();
});

const xzqChange = (value) => {
  console.log(value);
}
const xzqChange1 = (value) => {
  // params.value.testAr = value
}
const xzqChange2 = (value) => {
  // params.value.testAr = value
}
/** 行政区列表 */
const xzqProps = {
  lazy: true,
  lazyLoad(node, resolve) {
    let { value } = node
    //console.log(node)
    // 没有value,说明是省，赋值1
    if (!value) {
      value = 1
    }
    // 构造参数
    const params = {
      divisionId: value
    }
    xzqList(params).then((res) => {
      //console.log(res)
      if (res.code === 200) {
        const nodes = []
        res.data.forEach(item => {
          nodes.push({
            value: item.value,
            label: item.name,
            leaf: item.isLeaf,
          }
          )
        })
        // Invoke `resolve` callback to return the child nodes data and indicate the loading is finished.
        resolve(nodes)
      }
    })
  },
}

/** 工程类别列表 */
const getProjectTypeList = () => {
  projectTypeOptions.value = [
    {attachId: null,description: "14.国家级信息中心建筑（含大型、超大型数据中心）。\r【释义】本条是指重要的信息中心建筑，主要根据功能用途和重要性确定。国家级信息中心建筑应满足以下条件之一：\r（1）大型、超大型数据中心，其中大型数据中心一般是指机架数量为3000 至10000 个，超大型数据中心一般是指机架数量超过10000 个；\r（2）其他国家级信息中心建筑。\r【相关标准】G B 50223-2008《建筑工程抗震设防分类标准》第6.0.10 条。\r",dictCod: "dzqhgclb",dictId: "201048",dictItemCode: "dzqhgclb",dictItemName: "国家信息枢纽节点",dictName: "工程类别",sort: 6},
    {attachId: null,description: "4.坝高超过200 或库容大于100 亿m 3 的大（1）型工程。\r【释义】本条是指水利水电工程中的大（1）型工程，主要根据建设规模、场地条件确定：\r大（1）型工程应满足以下条件之一：\r（1）坝高超过200m ；\r（2）库容大于100 亿m 3；\r（3）位于7 度及以上地区，且坝高超过150m 。\r【相关标准】GB51247-2018《水工建筑物抗震设计标准》第1.0.5条及条文说明；SL252-2017《水利水电工程等级划分及洪水标准》第3.0.1条及条文说明。\r5.坝高超过150m 大（1）型工程，高度为90m以上的1级、2级大坝，抽水蓄能电站I等工程的主要建筑物。\r【释义】本条是指大坝和抽水蓄能电站2类重要雍水建筑物，此类建筑物不一定是高坝大库，但是一旦失事可能会导致严重后果，主要根据场地条件、重要性和建设规模确定：\r（1）大坝应同时满足以下3个条件：①场地位于7度及以上地区；②大坝等级为1级或2级大坝，即Ⅰ等、Ⅱ等工程中的大坝；③坝高90米以上。需要说明的是：对于3级大坝符合提级指标时，应同时满足以下3 个条件：\r①场地位于7 度及以上地区；\r②坝高超过70 米的土石坝，或坝高超过100 米混凝土、浆砌石坝；\r③大坝等级为3 级大坝，即Ⅲ等工程中的大坝。\r（2）抽水蓄能电站应同时满足以下3 个条件：\r①场地位于7 度及以上地区；\r②I等工程；\r③主要建筑物，一般是指闸、坝、溢洪道、发电厂房等水工建筑物。\r【相关标准】GB51247-2018《水工建筑物抗震设计标准》第1.0.6条及条文说明；SL252-2017《水利水电工程等级划分及洪水标准》第2.0.6条、3.0.1条、4.2.1条、4.2.2条及条文说明。\r6.大型引水、调水工程中的重要建筑物。\r【释义】本条是指引水、调水工程等重要雍水建筑物，此类建筑物不一定是高坝大库，但是一旦失事可能会导致严重后果，主要根据场地条件、重要性和建设规模确定：引水、调水工程应同时满足以下2个条件：\r①场地位于7度及以上地区；\r②重要建筑物，一般是在引水调水工程中起挡水、泄水等作用的建筑物。\r【相关标准】G B 51247-2018《水工建筑物抗震设计标准》第1.0.6条及条文说明；SL252-2017《水利水电工程等级划分及洪水标准》第2.0.6条、3.0.1条、4.2.1条、4.2.2条及条文说明。\r",dictCode: "dzqhgclb",dictId: "201048",dictItemCode: "dzqhgclb",dictItemName: "特大型水利水电设施",dictName: "工程类别",sort: 2,},
    {attachId: null,description: "1.核电厂、核热电厂、核供汽供热厂、核能海水淡化厂等核动力厂及装置。\r【释义】本条是指核工程中的核动力厂，主要根据功能用途确定，包括核电厂、核热电厂、核供汽供热厂、核能海水淡化厂等各种功能用途的核动力厂及装置。\r【相关标准】《中华人民共和国核安全法》第二条；GB50267-2019《核电厂抗震设计规范》第1.0.3 条、1.0.6 条及条文说明。\r2.核燃料生产、加工、贮存和后处理设施等核燃料循环设施。\r【释义】本条是指核工程中除核动力厂以外的其他反应堆，研究堆、实验堆、临界装置等各类反应堆均在该范围之内。\r【相关标准】《中华人民共和国核安全法》第二条；GB50267-2019《核电厂抗震设计规范》第1.0.3条、1.0.6 条及条文说明。\r3.浮动核动力装置的系泊装换料船坞、码头。\r【释义】本条是指核工程中的船坞码头，主要根据功能用途确定，专指浮动核动力装置的系泊装换料船坞、码头。\r【相关标准】《中华人民共和国核安全法》第二条；GB50267-2019《核电厂抗震设计规范》第1.0.3条、1.0.6条及条文说明。\r1.核电厂、核热电厂、核供汽供热厂、核能海水淡化厂等核动力厂及装置。\r【释义】本条是指核工程中的核动力厂，主要根据功能用途确定，包括核电厂、核热电厂、核供汽供热厂、核能海水淡化厂等各种功能用途的核动力厂及装置。\r【相关标准】《中华人民共和国核安全法》第二条；GB50267-2019《核电厂抗震设计规范》第1.0.3 条、1.0.6 条及条文说明。\r2.核燃料生产、加工、贮存和后处理设施等核燃料循环设施。\r【释义】本条是指核工程中除核动力厂以外的其他反应堆，研究堆、实验堆、临界装置等各类反应堆均在该范围之内。\r【相关标准】《中华人民共和国核安全法》第二条；GB50267-2019《核电厂抗震设计规范》第1.0.3条、1.0.6 条及条文说明。\r3.浮动核动力装置的系泊装换料船坞、码头。\r【释义】本条是指核工程中的船坞码头，主要根据功能用途确定，专指浮动核动力装置的系泊装换料船坞、码头。\r【相关标准】《中华人民共和国核安全法》第二条；GB50267-2019《核电厂抗震设计规范》第1.0.3条、1.0.6条及条文说明。\r",dictCode: "dzqhgclb",dictId: "201048",dictItemCode: "dzqhgclb",dictItemName: "重大涉核设施",dictName: "工程类别",sort: 1,},
    {attachId: null,description: "7.万千瓦级新能源基地：风电、光伏、储能电站等。\r【释义】能源发电装机容量达万千瓦级以上。8.亿吨级煤炭基地。\r【释义】煤炭资源储量大于1 亿吨的煤炭基地。\r9.大型石油天然气生产、储存基地。\r【释义】本条是指单罐库容不小于10 万立方米、总库容不小于100 万立方米的原油储备基地，单罐库容不小于5 千立方米、总库容不小于5 万立方米的成品油储备库，单罐库容不小于1 万立方米、总库容不小于10 万立方米的LNG 接收站，1 万立方米的液化石油气库等。\r",dictCode: "dzqhgclb",dictId: "201048",dictItemCode: "dzqhgclb",dictItemName: "重大能源基地",dictName: "工程类别",sort: 3,},
    {attachId: null,description: "10.油气干线输送管道。\r【释义】本条是指穿越或临近晚更新世（10 万年）以来活动断层，或位于基本地震动峰值加速度0.10g 及以上地区等抗震不利地段的油气干线输送管道，主要根据场地条件确定。\r油气干线输送管道应满足以下条件之一：\r（1）管道穿越或临近晚更新世（10 万年）以来活动断层，其中“临近”是指管道场地（管道轴线两侧各200 米宽的范围）内是否有晚更新世（10 万年）以来活动断层；\r（2）场地位于7 度及以上地区。\r【相关标准】GB/T50470-2017《油气输送管道线路工程抗震技术规范》第4.2.1条及条文说明。\r11.石油化工钢制设备中公称容积大于等于30000m 3的立式圆筒形储罐和高度大于80m的裙座式直立设备。\r【释义】本条是指石油化工中受地震破坏后的危害程度为较为严重的钢制设备，主要根据建设规模确定。\r石油化工钢制设备应满足以下条件之一：\r（1）公称容积≥30000m 3 的立式圆筒形储罐；\r（2）高度＞80m 的裙座式直立设备。\r【相关标准】GB50761-2018《石油化工钢制设备抗震设计规范》第3.1.1条及条文说明。\r",dictCode: "dzqhgclb",dictId: "201048",dictItemCode: "dzqhgclb",dictItemName: "油气储运骨干管线",dictName: "工程类别",sort: 4,},
    {attachId: null,description: "12.国家和区域电力调度中心。\r【释义】本条是指电力生产调度和管理所需要的设备提供运行环境及相关人员办公的场所，可以是一幢建筑物或建筑物的一部分，该类场所按照特殊设防类进行设防，主要根据功能用途和级别确定。\r电力调度中心应同时满足以下2个条件：\r（1）场所具有电力生产调度和管理的设备和功能；\r（2）国家级或区域级。\r【相关标准】GB50223-2008《建筑工程抗震设防分类标准》第3.0.2条、3.0.3条、5.2.3条及条文说明。\r13.国家骨干电网枢纽变电站。\r【释义】枢纽变电站坐落于电力系统的枢纽点，电压等级一般为330kV 及以上，关联多个电源，出现回路多，变电容量大;全站停电后将致使大面积停电，或系统土崩瓦解，枢纽变电站对电力系统运转的平稳和可靠性起到最主要功用。处于国家骨干电网中的枢纽变电站属于此条摸排范围。\r",dictCode: "dzqhgclb",dictId: "201048",dictItemCode: "dzqhgclb",dictItemName: "国家电力系统枢纽工程",dictName: "工程类别",sort: 5,},
    {attachId: null,description: "18.中央级救灾物资储备库。\r【释义】本条是由民政部确定的中央级救灾物资储备库，省、市、县级救灾物资储备库不在该范围内。中央级救灾物资储备库属于极为重要的应急服务设施，为确保其地震安全，需要开展地震安全性评价。\r【相关标准】G B T 51327-2018《城市综合防灾规划标准》第7.1.4 条。\r19.大型风洞设施、大型射电望远镜等有特殊需要的科学实验和重大科学装置工程。\r【释义】本条是指重大科学装置工程，主要根据功能用途和重要性确定。\r重大科学装置工程应包括以下类型：\r（1）大型风洞设施；\r（2）大型射电望远镜；\r（3）其他特殊需要的科学实验和重大科学装置工程。\r20.其他可能影响国计民生、国家战略、国家安全的重大基础设施。\r【释义】本条是兜底性条款，鉴于前述重大基础设施类型可能无法包含所有应当开展抗震设防基本情况摸排的工程，此条由各省局从国计民生、国家战略、国家安全等方面以及当地经济发展特点确定重大基础设施补充范围，例如重要铁路、重要港口等。\r",dictCode: "dzqhgclb",dictId: "201048",dictItemCode: "dzqhgclb",dictItemName: "其他重大基础设施",dictName: "工程类别",sort: 8,},
    {attachId: "3a792cdcfef64b76ab35c8a66cb371f8",description: "15.公路A 类桥梁、特长隧道。\r【释义】本条是指公路工程中重要的桥梁和隧道工程，通常是对抗震救灾以及经济、国防上具有重要意义或破坏后修复（抢修）困难的公路工程，主要根据场地条件和重要性确定。桥梁应满足以下条件之一：\r（1）属于A 类桥梁，即单跨跨径超过150 米的特大桥；\r（2）场地位于8 度及以上地区，且属于B 类桥梁。B 类桥梁为单跨跨径不超过150 米的高速公路、一级公路上的桥梁，以及单跨跨径不超过150 米的二级公路上的特大桥、大桥。特大桥、大桥的定义如下表所示:\r \r隧道工程应满足以下条件之一：\r（1）独立形式；\r（2）属于特长隧道，即隧道长度大于3000 米。\r【相关标准】JTG/T2231-01-2020《公路桥梁抗震设计规范》第5.1.4、3.1.1条;JTGB02-2013《公路工程抗震规范》第1.0.4条；JTGB01-2014《公路工程技术标准》第6.0.2、8.0.2条。\r16.水深大于20m、墩高大于80m、跨度大于150m及其它技术复杂、修复困难的铁路公路桥梁。\r【释义】本条是指特别重要的铁路工程中的复杂铁路桥梁，主要根据建设规模和复杂程度确定。铁路桥梁应同时满足以下条件：\r（1）水深大于20 米；\r（2）墩高大于80 米；\r（3）跨度大于150 米；\r（4）技术复杂或修复困难。\r【相关标准】GB50111-2006《铁路工程抗震设计规范(2009年版)》第1.0.3、1.0.4的条文说明。\r17.过江过海隧道。\r【释义】本条是指综合考虑经济、安全、修复的难易程度及工程在路网中的影响等因素，对越江隧道、海底隧道等特别重要的铁路工程，应进行地震安全性评价。\r【相关标准】GB50111-2006《铁路工程抗震设计规范(2009年版)》第1.0.3、1.0.4 的条文说明。\r",dictCode: "dzqhgclb",dictId: "201048",dictItemCode: "dzqhgclb",dictItemName: "重大交通基础设施",dictName: "工程类别",sort: 7,},
  ]
  projectTypeOptions.value.forEach(item=>{
      item.value = item.dictItemName,
      item.label = item.dictItemName
      // item.description = item.description,
      // item.attachId = item.attachId
  })
  // projectTypeList()
  //   .then((res) => {
  //     //console.log(res);
  //     if (res.code === 200) {
  //       projectTypeOptions.value = [];
  //       res.data.forEach((item) => {
  //         projectTypeOptions.value.push({
  //           value: item.dictItemName,
  //           label: item.dictItemName,
  //         });
  //       });
  //     }
  //   })
  //   .catch((err) => {
  //     console.log(err);
  //   });
};

/** 钻孔依托的项目 */
// const getprojectIdList = () => {
//   queryAllProject()
//     .then((res) => {
//       if (res.code === 200) {
//         projectIdOptions.value = [];
//         res.data.forEach((item) => {
//           projectIdOptions.value.push({
//             value: item.projectId,
//             label: item.projectName,
//           });
//         });
//       }
//     })
//     .catch((err) => {
//     });
// };

</script>

<style scoped lang="scss">
.el-form-register {
  .project-type-remarks {
    img {
      float: left;
    }

    min-height: 50px;
    max-height: 200px;
    overflow: auto;
  }

  .img-containers {
    .upload-file {
      padding: 12px;
    }
  }

  .column-header-sign {
    color: red;
  }

  .el-form-ls {
    div {
      h4 {
        font-size: 16px;
        font-weight: bold;
        color: #107ce5;
      }

      div {
        h5 {
          font-size: 16px;
          font-weight: bold;
          color: #333333;
          text-align: center;
        }
      }
    }
  }
}

.bottom-button {
  position: absolute;
  right: 235px;
  top: 20px;

  div:nth-child(2) {
    margin: 10px 0;
  }
}
</style>
